<template>
  <page-header-wrapper :title="false">
    <a-card title="">
      <a-row :gutter="30">
        <a-col :span="4">
          <a-card hoverable @click="toLink('BusinessList')">
            <a-statistic
              value="材料整理"
              :value-style="{ color: '#3f8600' }"
            >
            </a-statistic>
          </a-card>
        </a-col>
        <a-col :span="4">
          <a-card hoverable @click="toLink('Government')">
            <a-statistic
              value="提交官方"
              :value-style="{ color: '#3f8600' }"
            >
            </a-statistic>
          </a-card>
        </a-col>
        <a-col :span="4">
          <a-card hoverable @click="toLink('Information')">
            <a-statistic
              value="信息采集"
              :value-style="{ color: '#3f8600' }"
            >
            </a-statistic>
          </a-card>
        </a-col>
        <a-col :span="4">
          <a-card hoverable @click="toLink('TaskList')">
            <a-statistic
              value="案件列表"
              :value-style="{ color: '#3f8600' }"
            >
            </a-statistic>
          </a-card>
        </a-col>
        <a-col :span="4">
          <a-card hoverable @click="toLink('PatentStats')">
            <a-statistic
              value="数据统计"
              :value-style="{ color: '#3f8600' }"
            >
            </a-statistic>
          </a-card>
        </a-col>
        <a-col :span="4">
          <a-card hoverable @click="toLink('PatentBusiness')">
            <a-statistic
              value="业务维护"
              :value-style="{ color: '#3f8600' }"
            >
            </a-statistic>
          </a-card>
        </a-col>
      </a-row>
    </a-card>
    <a-card v-if="group == 'small_leader'" title="业务领取" style="margin-top:20px">
      <div>
        今日新增 <a>{{todayCount}}</a> 条
        <a-divider type="vertical" />
        剩余 <a>{{totalCount}}</a> 条
        <a-divider type="vertical" />
        <a-button type="default" style="margin-right:5px" @click="$refs.table.refresh(true)">刷新</a-button>
      </div>
      <a-divider />
      <div class="table-operator">
        <s-table
          bordered
          ref="table"
          size="middle"
          :row-key="(record) => record.cb_id"
          :columns="businessColumns"
          :data="businessData"
        >
          <template slot="xu" slot-scope="text,record,index">
            {{index + 1}}
          </template>
          <template slot="contract_no" slot-scope="text,record">
            {{text}}<br>
            {{record.business_no}}
          </template>
          <template slot="official_fee" slot-scope="text, record">
            <a-tag color="red">官费：{{text}}</a-tag><br>
            <a-tag color="red">价格：{{record.price}}</a-tag><br>
            <a-tag color="red">代理费：{{record.agency_fee}}</a-tag>
          </template>
          <template slot="adviser" slot-scope="text,record">
            <a-tag>{{text}}</a-tag><br>
            <a-tag>{{record.group_type}}</a-tag><br>
            <a-tag>{{record.leader}}</a-tag>
          </template>
          <template slot="action" slot-scope="text, record">
            <a-button size="small" type="danger" @click="onTransfer(record.cb_id)">指派</a-button>
          </template>
        </s-table>
      </div>
    </a-card>
    <a-modal
      title="指派流程人员"
      v-model="processVisible"
      :width="300"
      @ok="onAppointFlow"
    >
      <a-form-model-item label="流程人员">
        <a-select v-model="processForm.flow" placeholder="请选择要指派的流程人员" style="width:100%">
          <a-select-option v-for="(item,index) in processOpts" :key="index" :value="index">{{item}}</a-select-option>
        </a-select>
      </a-form-model-item>
    </a-modal>
  </page-header-wrapper>
</template>

<script>
import { STable } from '@/components'
import businessColumns from '@/columns/patent.process'
import { getFlow, getPatentData, postFlow } from '@/api/patent.process'
import storage from 'store'
import { GROUP } from '@/store/mutation-types'

export default {
  components: {
    STable
  },
  name: 'Workplace',
  data () {
    return {
      todayCount: 0,
      totalCount: 0,
      businessColumns: businessColumns.receive,
      businessData: parameters => {
        return getPatentData(parameters).then(res => {
          this.todayCount = res.result.today_unclaimed_count
          this.totalCount = res.result.total_unclaimed_count
          return res.result
        })
      },
      selectedRowKeys: [],
      processVisible: false,
      processForm: {},
      processOpts: {},
      group: storage.get(GROUP)
    }
  },
  methods: {
    toLink (url) {
      this.$router.push({ name: url })
    },
    onSelectChange (selectedRowKeys) {
      this.selectedRowKeys = selectedRowKeys
    },
    onTransfer (id) {
      const app = this
      this.processForm['cb_id'] = id
      getFlow(id).then(res => {
        if (res.status === 0) {
          app.processOpts = res.result.flow_opts
          this.processVisible = true
        } else {
          app.$error({
            title: '警告',
            content: res.msg
          })
        }
      })
    },
    onAppointFlow () {
      const app = this
      postFlow(this.processForm.cb_id, this.processForm).then(res => {
        if (res.status === 0) {
          app.processVisible = false
          app.$refs.table.refresh()
        } else {
          app.$warning({
            title: res.msg
          })
        }
      })
    }
  }
}
</script>

<style scoped>

</style>
